<template>
	<div>
		<header id="header" class="mui-bar mui-bar-nav">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">{{headTitle}}</h1>
		</header>
		<div class="mui-content">
			<ul class="mui-table-view mui-table-view-chevron" style="margin-top: 0;">
					<li class="mui-table-view-cell mui-collapse myCollapse" v-for="list in lists">
						<a :class="['headText',{'mui-navigate-right': parseInt(list.Lessons)!=0}]">
							{{list.StudentName}}
							<span class="mui-pull-right">{{list.Lessons}}</span>
						</a>
						<ul v-if ="parseInt(list.Lessons) != 0 "  class="mui-table-view mui-table-view-chevron detailInfo">
							<li class="mui-table-view-cell" v-for="item in list.Courses">
								<span>{{item.Date}}</span>
								<span>{{item.Lessons}}</span>
								<span>{{item.CourseName}}</span>
							</li>
						</ul>
					</li>
				</ul>
		</div>
	</div>
</template>
<script>
import {
	classRoomDetail
} from '@/service/getData';
import { saveToLocal, loadFromLocal } from '@/service/store';
	export default{
		data (){
			return {
				headTitle : this.$route.params.name + '（' + this.$route.params.num +'）',
				lists : []
			}
		},
		created(){
			classRoomDetail({
				"userID": loadFromLocal("userInfo","obj").userId,
				"dateType":this.$route.params.status,
				"typeID": this.$route.params.typeId,
				"SpecialtyID": this.$route.params.SpecialtyID=="null"?"":this.$route.params.SpecialtyID,
				"GradeID":this.$route.params.GradeID=="null"?"":this.$route.params.GradeID,
				"classID": this.$route.params.classId=="null"?"":this.$route.params.classId,
				"StudentID":this.$route.params.studentID=="null"?"":this.$route.params.studentID
			}).then((res) => {
				this.lists = res.data;
			})
		}
	}
</script>
<style scoped>
</style>